<template>
  <div style="padding: 20px">
    <el-form :label-position="labelPosition" label-width="22%" :model="formLabelAlign">
      <br/>
      <div class="text">添加新的商品类型</div>
      <br/>
      <el-form-item label="类型名">
        <el-input v-model="formLabelAlign.typeName"></el-input>
      </el-form-item>
      <el-form-item label="类型编码">
        <el-input v-model="formLabelAlign.typeCode"></el-input>
      </el-form-item>
      <el-form-item label="是否上架">
        <el-select v-model="formLabelAlign.typeOn">
          <el-option label="是" value="1"></el-option>
          <el-option label="否" value="0"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item>
        <el-button type="primary"  @click="upload">添加</el-button>
        <el-button >取消</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
  import qs from 'qs'
  export default {
    data() {
      return {
        labelPosition: 'left',
        formLabelAlign: {
        }
      };
    },
    methods:{

      upload: function() {
        let addproduct={
          typeName: this.formLabelAlign.typeName,
          typeCode: this.formLabelAlign.typeCode,
          typeOn: this.formLabelAlign.typeOn,
        }
        this.$axios({
          headers:{
            "Content-Type": "application/json"
          },
          method:"post",
          url:"http://localhost:8080/api/producttype/addtype",
          data: {
            typeName:addproduct.typeName,
            typeCode:addproduct.typeCode,
            typeOn: addproduct.typeOn
          }
        }).then((res)=>{
          if(res.data.resultCode==="0"){
            this.$message({
              message: '添加成功',
              type: 'success'
            });
          }
        })
      }
    }
  }
</script>

<style scoped>
  .text {
    font-size: 30px;
    line-height: 46px;
    text-align: center;
  }
</style>

